<template>
    <BButton class="tnxbsv-button" :variant="type || 'light'" :loading="loading" :disabled="loading">
        <i class="me-1" :class="icon" v-if="icon"></i>
        <div>
            <slot></slot>
        </div>
        <template #loading>
            <LoadingIcon class="me-1" theme="inherit"/>
            <div>
                <slot></slot>
            </div>
        </template>
    </BButton>
</template>

<script>
import {BButton} from 'bootstrap-vue-next';
import LoadingIcon from '../loading-icon/LoadingIcon.vue';

export default {
    name: 'TnxbsvButton',
    components: {BButton, LoadingIcon},
    props: {
        type: String,
        icon: String,
        loading: Boolean,
    },
    data() {
        return {};
    },
    methods: {}
}
</script>

<style>
.tnxbsv-button {
    display: flex;
    align-items: center;
}
</style>
